<template>
  <div class="container">
    <!-- 评论列表 -->
    <CommentList v-if="userinfo.openId" type="user" :comments="comments"></CommentList>

    <div v-if="userinfo.openId">
      <div class="page-title">我的图书</div>

      <!-- 图书列表 -->
      <Card
        v-for="book in books"
        :key="book.id"
        :book="book"
      ></Card>

      <div v-if="!books.length">暂时还没有添加图书</div>
    </div>
  </div>
</template>
<style>

</style>
<script>
  import { get } from '@/util'
  import CommentList from '@/components/CommentList'
  import Card from '@/components/Card'
  export default {
    components: {
      CommentList,
      Card
    },
    data () {
      return {
        comments: [],
        books: [],
        userinfo: {}
      }
    },
    methods: {
      init () {
        wx.showNavigationBarLoading()
        // 获取评论
        this.getComments()
        // 获取图书列表
        this.getBooks()
        wx.hideNavigationBarLoading()
      },
      /**
       * 获取图书列表
       */
      async getBooks () {
        const books = await get('/weapp/booklist', {
          openid: this.userinfo.openId
        })
        this.books = books.list
      },
      /**
       * 获取评论
       */
      async getComments () {
        const comments = await get('/weapp/commentlist', {
          openid: this.userinfo.openId
        })
        this.comments = comments.list
      }
    },
    /**
     * 自动执行函数
     */
    onShow () {
      if (!this.userinfo.openId) {
        let userinfo = wx.getStorageSync('userInfo')
        if (userinfo) {
          this.userinfo = userinfo
          this.init()
        }
      }
    },
    /**
     * 下拉刷新
     */
    onPullDownRefresh () {
      this.init()
      wx.stopPullDownRefresh()
    }
  }
</script>
